<template>
  <div>
    <el-scrollbar style="height: 550px;border: 1px solid rgba(144,147,153,.5);">
      <el-col style="padding: 5px 3px;">
        <el-tree
          ref="tree"
          style="margin-top: 12px;"
          show-checkbox
          :data="jsonTree"
          node-key="id"
          highlight-current
          :expand-on-click-node="false"
        />
      </el-col>
    </el-scrollbar>

    <div class="dialogBottmView">
      <el-button @click="closeDialog">取 消</el-button>
      <el-button @click="saveDialog" :loading="saveLoading" type="primary">确 定</el-button>
    </div>
  </div>
</template>
<script>
import { getJsonTree } from '@/utils/index';
import { dictionary } from '@/utils/dictMixin';

import { queryClueSourceList, queryTreeSourceAll } from '@/api/potenCus/customer/potenCusManage';

export default {
  mixins: [dictionary],
  data() {
    return {
      saveLoading: false,

      tree: [],
      // jsonTree:[],
      checkedList: {},
      orgTree: [], //组织树
      provinceList: {} //省份列表
    };
  },
  created() {
    this.searchTree();
  },
  computed: {
    jsonTree() {
      this.tree.forEach(el => (el.label = el.clueName));
      // this.tree.forEach(el => (el.value = el.id));
      this.tree.forEach(el => (el.parentId = el.upClueId));
      console.log('this.tree:', this.tree);
      return getJsonTree(this.tree);
    }
  },
  props: {
    value: {
      type: String,
      default: ''
    }
  },
  methods: {
    //保存按钮
    async saveDialog() {
      let checkedNodes = this.$refs['tree'].getCheckedNodes();
      let halfCheckedNodes = this.$refs['tree'].getHalfCheckedNodes();

      console.log('checkedNodes:', checkedNodes);
      console.log('halfCheckedNodes:', halfCheckedNodes);

      let searchNodes = [];
      for (let i in checkedNodes) {
        let node = checkedNodes[i];
        if (node.children == null || node.children.length == 0) {
          searchNodes.push(node);
        }
      }
      console.log('searchNodes:', searchNodes);

      if (searchNodes.length == 0) {
        this.$notify.warning({ title: '提示信息', message: '请勾选来源渠道!' });
        return;
      }
      this.$emit('close', { visible: false, data: searchNodes });
    },

    //取消操作
    closeDialog() {
      this.$emit('close', { visible: false });
    },

    //加载树
    async searchTree() {
      const res = await queryTreeSourceAll();
      this.tree = res.data;

      let pam = this.value.split(',');
      if ('' != this.value) {
        this.$refs['tree'].setCheckedKeys(pam);
      }
    }
  }
};
</script>

<style lang="less" scoped>
</style>
